const path = require('path');
const webpack = require('webpack');
const {
  Utils
} = require('./utils');
const SrcPath = path.resolve(__dirname, 'src');
const devPath = path.resolve(__dirname, 'dev');
const entryMap = Utils.getEntryMap();
const htmlArray = Utils.getHtmlArray(entryMap);


const config = {
  mode: 'development',
  devServer: {
    host: '127.0.0.1', // 服务器的IP地址，可以使用IP也可以使用localhost
    contentBase: devPath,
    compress: true, // 服务端压缩是否开启
    port: 3000, // 端口
    hot: true,
    // open: true, // 自动打开浏览器
    overlay: {
      errors: false
    },
    stats: "errors-only"
  },
  entry: entryMap, // 多入口
  output: {
    path: devPath,
    filename: '[name].min.js'
  },
  resolve: {
    alias: {
      component: path.resolve(SrcPath, 'component')
    },
    extensions: ['.js', '.jsx']
  },
  module: {
    rules: [{
        test: /\.(js|jsx|ts|tsx)?$/,
        exclude: /(node_modules|bower_components)/,
        use: [
          'babel-loader',
          'eslint-loader'
        ]
      },
      {
        test: /\.css$/,
        use: [
          'style-loader',
          {
            loader: 'css-loader',
            options: {
              minimize: true
            }
          },
          'postcss-loader'
        ],
        include: SrcPath
      },
      {
        test: /\.scss$/,
        use: ['style-loader', 'css-loader', 'postcss-loader', 'sass-loader',{
          loader: 'sass-resources-loader',
          options: {
              resources: SrcPath + '/common/scss_fun.scss'
          }
        }],
        include: SrcPath
      },
      {
        test: /\.less$/,
        use: [{
            loader: 'style-loader'
          },
          {
            loader: 'css-loader',
            options: {
              importLoaders: 1
            }
          },
          {
            loader: 'postcss-loader'
          },
          {
            loader: 'less-loader' // 如果less文件中使用了@import 引入了别的less文件，这里可以不用设置importLoaders
          }
        ]
      },
      {
        test: /\.(png|jpg|jpeg|gif|svg)$/,
        use: [{
          loader: 'url-loader',
          options: {
            limit: 20000,
            name: 'image/[name]-[hash:8].[ext]'
          }
        }],
        exclude: /(node_modules|bower_components)/,
      },
      {
        test: /\.(woff2|eot|ttf|otf)$/,
        use: [{
          loader: 'url-loader',
          options: {
            limit: 100000,
            name: 'fonts/[name]-[hash:7].[ext]'
          }
        }],
        exclude: /(node_modules|bower_components)/,
      },
      {
        test: /\.json$/,
        loader: 'json-loader'
      },
    ]
  },
    // 优化
  optimization: {
    splitChunks: {
      // 引入的公共js的抽离
      cacheGroups: {
        common: {
          test: /[\\/]node_modules[\\/]/,
          chunks: 'all',
          name: 'common'
        }
      }
    }
  },
  plugins: [
    new webpack.NamedModulesPlugin(),
    new webpack.HotModuleReplacementPlugin(),
  ].concat(htmlArray)
}

module.exports = config
